<template>
    <div class="header">
            <img src="../../assets/images/logo.png" width="100%" style="height:3rem;">
            <div class="text">
                <span>登陆</span>
                <span>|</span>
                <span>注册</span>
                <div class="btn_signIn btn_rec_small">签到</div>
                <div class="btn_menu">
                    <img src="../../assets/images/icon_06.png" alt="" width="24"/>
                    <span>菜单</span>
                </div>
            </div>
    </div>
</template>

<script>
    export default {
        name: 'header',
        components: {},
        data(){
            return {}
        },
        created(){

        },
        methods: {},

    }
</script>

<style lang="less" rel="stylesheet/less" type="text/less">
    .header {
        width: 100%;
        height: 3rem;
            .text {
                position: absolute;
                padding-left:calc( 60% -  15rem );
                margin-top: -3rem;
                color:#555;
                > span {
                    padding-right: .2rem;
                    line-height:2.5rem;
                }
                .btn_signIn {
                    display: inline-block;
                    background: #E70012;
                    width: 2.5rem;
                    margin:0 .3rem 0 .3rem;
                }
                .btn_menu {
                    display: inline-block;
                    height: 2.5rem;
                    span {
                        display: block;
                        font-size:.5rem;
                        text-align: center;
                    }
                }
            }
        }
</style>